<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>抽签网页</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
            padding: 20px;
        }

        input,
        button {
            padding: 10px;
            margin: 10px;
        }

        #result {
            margin-top: 20px;
            font-size: 18px;
        }
    </style>
</head>

<body>
    <h1>抽签答案之书</h1>
    <p>请输入你的问题（如爱情、事业、财运、健康、人际关系等方面）：</p>
    <input type="text" id="question" placeholder="输入你的问题">
    <button onclick="drawLottery()">抽签</button>
    <div id="result"></div>

    <script>
        function drawLottery() {
            const question = document.getElementById('question').value;
            const categories = ['爱情', '事业', '财运', '健康', '人际关系'];
            const category = categories.find(cat => question.includes(cat)) || '通用';

            const positiveAnswers = {
                '爱情': '爱情之花即将绽放，一段美好的恋情正悄然靠近你。',
                '事业': '事业上会有重大突破，你的努力将得到丰厚回报。',
                '财运': '财运亨通，近期会有意外之财降临。',
                '健康': '你的身体状况会越来越好，活力满满。',
                '人际关系': '你会结识许多新朋友，人际关系更加和谐。',
                '通用': '一切都会朝着好的方向发展，保持乐观心态。'
            };

            const negativeAnswers = {
                '爱情': '近期爱情可能会遇到一些小波折，需要耐心经营。',
                '事业': '事业上可能会遇到一些挑战，需谨慎应对。',
                '财运': '财运方面可能会有小损失，要注意理财。',
                '健康': '要多注意身体健康，可能会有一些小不适。',
                '人际关系': '人际关系可能会出现一些小矛盾，需妥善处理。',
                '通用': '可能会遇到一些小麻烦，但只要积极面对就能解决。'
            };

            const neutralAnswers = {
                '爱情': '爱情处于平稳状态，继续用心经营会有好结果。',
                '事业': '事业按部就班进行，保持努力会有进步。',
                '财运': '财运平稳，收支平衡，无大起大落。',
                '健康': '身体健康状况一般，注意保持良好生活习惯。',
                '人际关系': '人际关系正常，与他人友好相处即可。',
                '通用': '目前情况较为平稳，继续保持。'
            };

            const answerTypes = [positiveAnswers, negativeAnswers, neutralAnswers];
            const randomIndex = Math.floor(Math.random() * answerTypes.length);
            const selectedAnswer = answerTypes[randomIndex][category];

            document.getElementById('result').innerHTML = `针对你关于 ${category} 的问题，答案是：${selectedAnswer}`;
        }
    </script>
</body>

</html>